<html>
<head>
<title>Spinner Tools</title>
<style>
@font-face {   font-family: 'Duru Sans';   font-style: normal;   font-weight: 400;   src: local('Duru Sans'), local('DuruSans-Regular'), url(http://themes.googleusercontent.com/static/fonts/durusans/v3/0rnIdjSQWlqFS5KpKzVfzj8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); }

  .badan {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 5px 15px #BBBBBB;
    margin: 10px auto;
    padding: 5px 10px;
    position: relative;
    width: 503px;
    font-family: 'Duru Sans', sans-serif;
    
}
</style>
</head>

<body>
<div class='badan'>
<h3 style="text-align:left">
Membuat Tulisan Terbalik</h3>
<form>

<h4 style="text-align:left">
Tulisan Asli:</h4>
<textarea cols="60" name="original" onkeyup="flip()" rows="6"></textarea>


<h4 style="text-align:left">
Hasil Perubahan:</h4>
<textarea cols="60" name="flipped" onclick="this.focus();this.select()" onfocus="this.select()" onmouseover="this.focus()" rows="7" style="background: none repeat scroll 0% 0% rgb(238, 238, 238); display: inline;"></textarea>
</form>
</div>
<script language="JavaScript">
function flip() {
var result = flipstring(document.f.original.value.toLowerCase());
document.f.flipped.value = result;
}
function flipString(aString) {
var last = aString.length - 1;
var result = new Array(aString.length)
for (var i = last; i >= 0; --i) {
var c = aString.charAt(i)
var r = flipTable[c]
result[last - i] = r != undefined ? r : c
}
return result.join('')
}
var flipTable = {
a : '\u0250',
b : 'q',
c : '\u0254',
d : 'p',
e : '\u01DD',
f : '\u025F',
g : '\u0183',
h : '\u0265',
i : '\u0131',
j : '\u027E',
k : '\u029E',
//l : '\u0283',
m : '\u026F',
n : 'u',
r : '\u0279',
t : '\u0287',
v : '\u028C',
w : '\u028D',
y : '\u028E',
'.' : '\u02D9',
'[' : ']',
'(' : ')',
'{' : '}',
'?' : '\u00BF',
'!' : '\u00A1',
"\'" : ',',
'<' : '>',
'_' : '\u203E',
'\\' : '/',
';' : '\u061B',
'\u203F' : '\u2040',
'\u2045' : '\u2046',
'\u2234' : '\u2235'
}
for (i in flipTable) {
flipTable[flipTable[i]] = i
}
</script>
</body>
</html>
